<template>
  <div class="driver">
    <div class="form">
      <el-form ref="form" :model="form" :rules="rule" label-width="auto" inline="true" size="mini">
        <el-form-item prop="trkNo" label="车牌号：">
          <el-input v-model="form.trkNo" clearable></el-input>
        </el-form-item>

        <el-form-item prop="trkType" label="车型：">
          <el-select v-model="form.trkType" style="width: 95%" clearable>
            <el-option v-for="(item, index) in carType" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="" label="">
          <el-button type="primary" size="mini" @click="search">查 询</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="btn">
      <buttonName @clickEvent="clickEventDom"></buttonName>
      <!-- <el-button plain size="mini" type="primary" v-if="isAuth('add')" @click="addCar">新增车辆</el-button>
      <el-button plain size="mini" type="primary" v-if="isAuth('edit')" @click="editCar">编辑车辆</el-button>
      <el-button plain size="mini" type="primary" v-if="isAuth('del')" @click="delCar">删除车辆</el-button> -->
      <!--      <div class="upload">-->
      <!--        <el-upload-->
      <!--          action=""-->
      <!--          :http-request="uploadExcel"-->
      <!--          :show-file-list="false"-->
      <!--          class="upload-demo">-->
      <!--          <el-button size="small" type="primary">批量导入</el-button>-->
      <!--        </el-upload>-->
      <!--      </div>-->
    </div>

    <div class="name">车辆列表</div>
    <div class="table" ref="inner">
      <el-table
        :data="tableData"
        border
        :height="maxHeight"
        :header-cell-style="{ textAlign: 'center' }"
        highlight-current-row
        @row-click="rowClick"
        @row-dblclick="dbrowClick"
      >
        <el-table-column :index="indexMethod" type="index" align="center" label=" " width="50"></el-table-column>
        <el-table-column align="center" prop="zjcz" label="证件操作" show-overflow-tooltip width="180" sortable>
          <template slot-scope="scope">
            <el-link type="primary" @click="upload">证件上传</el-link>&nbsp;&nbsp;
            <el-link type="primary" @click="viewPic(scope.row)">证件查看</el-link>
          </template>
        </el-table-column>
        <!-- <el-table-column align="center" label="审核状态" prop="status" show-overflow-tooltip>
             <template slot-scope="scope">
                <span v-if="scope.row.status =='0'">未审核</span>
                <span v-if="scope.row.status =='1'">已审核</span>
              </template>
          </el-table-column> -->
        <!-- <el-table-column  align="center" prop="clzt" label="车辆状态" show-overflow-tooltip width="130" sortable></el-table-column> -->
        <el-table-column align="right" prop="trkNo" label="车牌号" show-overflow-tooltip width="130" sortable></el-table-column>
        <el-table-column align="right" prop="trkDrvName" label="司机" show-overflow-tooltip width="140" sortable></el-table-column>
        <el-table-column align="right" prop="trkConductor" label="车长" show-overflow-tooltip width="140" sortable></el-table-column>
        <el-table-column align="left" prop="trkTypeName" label="车型" show-overflow-tooltip width="120" sortable></el-table-column>
        <el-table-column align="left" prop="trkColor" label="车辆颜色 " show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="left" prop="trkAxlenumberName" label="车轴数" show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="right" prop="trkTonnage" label="载重吨(T) " show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="right" prop="terminalNo" label="设备号 " show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="left" prop="trkUsercharacter" label="使用性质" show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="left" prop="trkIssuingorg" label="发证机关" show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="left" prop="trkRtcn" label="道路运输证号" show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="left" prop="trkRegisterdate" label="注册日期  " show-overflow-tooltip width="140" sortable></el-table-column>
        <el-table-column align="left" prop="trkIssuedate" label="发证日期  " show-overflow-tooltip width="180" sortable></el-table-column>
        <el-table-column align="right" prop="trkGrossmass" label="总质量(T)" show-overflow-tooltip width="130" sortable></el-table-column>
        <el-table-column align="left" prop="creator" label="创建人" show-overflow-tooltip width="130" sortable></el-table-column>
        <el-table-column align="center" prop="created" label="创建时间" show-overflow-tooltip width="130" sortable></el-table-column>
        <el-table-column align="left" prop="lastmodifier" label="最后修改人" show-overflow-tooltip width="130" sortable></el-table-column>
        <el-table-column align="center" prop="lastmodified" label="最后修改时间" show-overflow-tooltip width="130" sortable></el-table-column>
        <el-table-column align="center" prop="trkVlflag" label="使用否" show-overflow-tooltip width="120" sortable>
          <template slot-scope="scope">
            <el-checkbox v-model="scope.row.trkVlflag" true-label="Y" false-label="N" :disabled="true"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column align="left" prop="trkRemark" label="备注" show-overflow-tooltip width="120" sortable></el-table-column>
      </el-table>
    </div>
    <div class="pages">
      <el-pagination
        ref="pagination"
        small
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="Pagination.currentPage"
        :page-sizes="Pagination.pageSizeList"
        :page-size="Pagination.pageSize"
        :layout="Pagination.layout"
        :total="Pagination.total"
      >
      </el-pagination>
    </div>
    <!-- 对话框 新增 编辑车辆 -->
    <el-dialog width="700px" :title="name" :visible.sync="openDialog" v-if="openDialog" v-el-drag-dialog :before-close="close" :close-on-click-modal="false">
      <el-form :model="dialogForm" size="mini" :rules="dialogRule" ref="dialogForm" label-width="auto">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkNo" label="车牌号：">
              <el-input v-model="dialogForm.trkNo" style="width: 95%" clearable :disabled="see" maxlength="32"> </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkDriverUuid" label="司机姓名：">
              <el-select v-model="dialogForm.trkDriverUuid" style="width: 95%" clearable :disabled="see" filterable>
                <el-option v-for="(item, index) in driver" :key="index" :value="item.uuid" :label="item.dvrName"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkConductor" label="车长：">
              <el-select v-model="dialogForm.trkConductor" style="width: 95%" clearable :disabled="see" filterable>
                <el-option v-for="(item, index) in carLong" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkType" label="车型：">
              <el-select v-model="dialogForm.trkType" style="width: 95%" clearable :disabled="see" filterable>
                <el-option v-for="(item, index) in carType" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkOwner" label="所有人：">
              <el-input v-model="dialogForm.trkOwner" style="width: 95%" maxlength="32" clearable :disabled="see"> </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkGrossmass" label="总质量(t)：">
              <el-input v-model="dialogForm.trkGrossmass" style="width: 95%" maxlength="32" clearable :disabled="see"> </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkTonnage" label="载重吨：">
              <el-input v-model="dialogForm.trkTonnage" style="width: 95%" maxlength="32" clearable :disabled="see"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkColorcode" label="车牌颜色代码：">
              <el-select v-model="dialogForm.trkColorcode" style="width: 95%" clearable :disabled="see">
                <el-option v-for="(item, index) in carColor" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkUsercharacter" label="使用性质：">
              <el-input v-model="dialogForm.trkUsercharacter" style="width: 95%" maxlength="32" clearable :disabled="see"> </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkVin" label="车辆识别代码：	">
              <el-input v-model="dialogForm.trkVin" style="width: 95%" maxlength="27" clearable :disabled="see"> </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkIssuingorg" label="发证机关：">
              <el-input v-model="dialogForm.trkIssuingorg" style="width: 95%" maxlength="32" clearable :disabled="see"> </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkRegisterdate" label="注册日期：">
              <el-date-picker
                v-model="dialogForm.trkRegisterdate"
                style="width: 95%"
                @change="startTimeChange"
                clearable
                :disabled="see"
                value-format="yyyy-MM-dd"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkIssuedate" label="发证日期：">
              <el-date-picker
                v-model="dialogForm.trkIssuedate"
                style="width: 95%"
                clearable
                @change="endTimeChange"
                :disabled="see"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkEnergytype" label="车辆能源类型：">
              <el-input v-model="dialogForm.trkEnergytype" style="width: 95%" clearable :disabled="see" maxlength="16"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item prop="trkAxlenumber" label="车辆轴数：">
              <el-select v-model="dialogForm.trkAxlenumber" style="width: 95%" clearable :disabled="see" filterable>
                <el-option v-for="(item, index) in carAxel" :key="index" :value="item.rvLowValue" :label="item.rvCmeaning"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="trkVlflag" label="使用否">
              <el-radio-group v-model="dialogForm.trkVlflag" :disabled="see" style="width: 95%">
                <el-radio label="Y">是</el-radio>
                <el-radio label="N">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="24">
          <el-form-item prop="trkRtcn" label="道路运输证号：">
            <el-col :span="24">
              <el-input v-model="dialogForm.trkRtcn" style="width: 98%" clearable :disabled="see" maxlength="14"></el-input>
            </el-col>
          </el-form-item>
        </el-row>
        <el-row :gutter="24">
          <el-form-item prop="trkEnginenumber" label="发动机号：">
            <el-col :span="24">
              <el-input v-model="dialogForm.trkEnginenumber" style="width: 98%" clearable :disabled="see" maxlength="32"></el-input>
            </el-col>
          </el-form-item>
        </el-row>
        <el-row :gutter="24">
          <el-form-item prop="trkTvpn" label="挂车牌照号：">
            <el-col :span="24">
              <el-input v-model="dialogForm.trkTvpn" :rows="2" style="width: 98%" :disabled="see" maxlength="32"></el-input>
            </el-col>
          </el-form-item>
        </el-row>
        <el-row :gutter="24">
          <el-form-item prop="terminalNo" label="设备号：">
            <el-col :span="24">
              <el-input v-model="dialogForm.terminalNo" :rows="2" style="width: 98%" :disabled="see" maxlength="32"></el-input>
            </el-col>
          </el-form-item>
        </el-row>
        <!-- <el-row :gutter="20">
            <el-form-item prop="trkVlflag" label="使用否">
              <el-col :span="20">
               <el-radio-group v-model="dialogForm.trkVlflag" :disabled="see">
                 <el-radio label="Y">是</el-radio>
                 <el-radio label="N">否</el-radio>
               </el-radio-group>
              </el-col>
            </el-form-item>
          </el-row> -->
        <el-row :gutter="24">
          <el-form-item prop="trkRemark" label="备注：">
            <el-col :span="24">
              <el-input type="textarea" v-model="dialogForm.trkRemark" :rows="2" style="width: 98%" maxlength="200" :disabled="see"></el-input>
            </el-col>
          </el-form-item>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="close" size="mini">关闭</el-button>
        <el-button type="primary" @click="save" v-if="!see" size="mini">保存</el-button>
      </div>
    </el-dialog>
    <!-- 对话框 证件上传 查看 -->
    <el-dialog
      :title="title"
      :width="widthImg"
      :visible.sync="openUpload"
      v-if="openUpload"
      v-el-drag-dialog
      :before-close="closeUpload"
      :close-on-click-modal="false"
      append-to-body
    >
      <div class="box" v-if="!pic">
        <div class="selectItem">
          <el-select v-model="issuse">
            <el-option v-for="(item, index) in list" :key="index" :value="item.code" :label="item.name"></el-option>
          </el-select>
        </div>
        <div class="upload">
          <el-upload action="" :http-request="uploadImage" :before-upload="beforeUpload" :show-file-list="false" class="upload-demo">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过5M</div>
          </el-upload>
        </div>
      </div>
      <div class="pic" v-else>
        <h1>行驶证正面：</h1>
        <br /><img :src="trkDrivingPositive" alt="未上传" /><br />
        <h1>行驶证反面：</h1>
        <br /><img :src="trkDrivingReverse" alt="未上传" /><br />
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeUpload" size="mini">关闭</el-button>
      </div>
    </el-dialog>

    <!-- 货物品牌导入对话框 -->
    <el-dialog :title="uploadParam.title" :visible.sync="uploadParam.open" width="400px" append-to-body>
      <el-upload
        ref="upload"
        :limit="1"
        accept=".xlsx"
        :headers="uploadParam.headers"
        :action="uploadParam.url"
        :disabled="uploadParam.isUploading"
        :on-progress="handleFileUploadProgress"
        :on-success="handleFileSuccess"
        :data="uploadParam.data"
        :auto-upload="false"
        drag
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">
          将文件拖到此处，或
          <em>点击上传</em>
        </div>
        <div class="el-upload__tip" style="color: red" slot="tip">提示：仅允许导入“.xlsx”格式文件！</div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
        <el-button @click="uploadParam.open = false">取 消</el-button>
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import paginationMixin from '@/mixins/pagination'
import resizeMixin from '@/mixins/resize'
import isAuth from '@/mixins/buttonAuth'
import buttonName from '@/components/buttonName/button-name.vue'
import {
  getDriverModelList,
  getRefCodesByType,
  getVehicleModelList,
  addVehicleModel,
  editVehicleModel,
  delVehicleModel,
  auditCarMethod,
  uploadVehicleImg,
  // downBillsFile,
  importDynamicNode,
} from '@/request/api'
import store from '@/store'
import { getToken } from '@/request/http'
import { downloadVehicleInformation } from '@/request/masterData/vehicleNews'
export default {
  name: 'router.driver',
  mixins: [paginationMixin, resizeMixin, isAuth],
  data() {
    return {
      form: {
        trkNo: '',
        trkType: '',
      },
      trkDrivingPositive: '', //行驶证正面图片
      trkDrivingReverse: '', //行驶证反面图片
      widthImg: '500px',
      carType: [{ code: '1', name: '货车' }],
      maxHeight: -1,
      tableData: [],
      currentData: {},
      issuse: '',
      list: [
        { code: 'xszz', name: '行驶证正面' },
        { code: 'xszb', name: '行驶证反面' },
      ],
      // 车辆对话框
      name: '',
      openDialog: false,
      dialogForm: {},
      dialogRule: {
        trkNo: [{ required: true, message: '请输入车牌号', trigger: 'blur' }],
        trkDriverUuid: [{ required: true, message: '请选择司机', trigger: 'blur' }],
        trkTonnage: [
          { required: true, message: '请输入载重吨', trigger: 'blur' },
          {
            pattern: /^\d+$|^(\d+)(\.\d+)?$/,
            message: '请输入阿拉伯数字',
            trigger: 'blur',
          },
        ],
        // trkConductor:[{required:true,message:'请输入车长',trigger:'blur'}],
        // trkType:[{required:true,message:'请输入车型',trigger:'blur'}],
        // trkOwner:[{required:true,message:'请输入所有人',trigger:'blur'}],
        // trkGrossmass:[{required:true,message:'请输入总质量',trigger:'blur'},
        //   {
        //     pattern:/^\d+$|^(\d+)(\.\d+)?$/,
        //     message:'请输入阿拉伯数字',
        //     trigger:'blur'
        //   }
        // ],

        // trkColorcode:[{required:true,message:'请输入车辆颜色',trigger:'blur'}],
        // trkUsercharacter:[{required:true,message:'请输入使用性质',trigger:'blur'}],
        // trkVin:[{required:false,message:'请输入车辆识别码',trigger:'blur'}],
        // trkIssuingorg:[{required:true,message:'请输入发证机关',trigger:'blur'}],
        // trkRegisterdate:[{required:true,message:'请输入注册日期',trigger:'blur'}],
        // trkIssuedate:[{required:true,message:'请输入发证日期',trigger:'blur'}],
        // trkEnergytype:[{required:true,message:'请输入车辆能源类型',trigger:'blur'}],
        // trkAxlenumber:[{required:true,message:'请输入车轴数',trigger:'blur'}],
        // trkRtcn:[{required:true,message:'请输入道路运输证号',trigger:'blur'}],
        // trkEnginenumber:[{required:true,message:'请输入发动机号',trigger:'blur'}],
        // trkTvpn:[{required:false,message:'请输入挂车牌照号',trigger:'blur'}],
        // sy:[{required:true,message:'请输入',trigger:'blur'}],
      },
      edit: false, // 编辑模式
      see: false, //查看模式
      carLong: [], //车长
      carAxel: [], //车轴
      driver: [], //司机
      carColor: [], //车辆颜色
      //上传、查看图片对话框
      openUpload: false,
      pic: false,
      title: '上传证件',
      // 车辆信息导入参数
      uploadParam: {
        // 是否显示弹出层（用户导入）
        open: false,
        // 弹出层标题（用户导入）
        title: '',
        // 是否禁用上传
        isUploading: false,
        // 是否更新已经存在的用户数据
        updateSupport: 0,
        // 设置上传的请求头部
        headers: { Token: getToken() },
        data: {
          fltUuid: '',
          fltName: '',
        },

        // 上传的地址
        url: (process.env.NODE_ENV === 'production' ? '/' : '/proxy/') + '/FTKJWLHYPT/transoprt/importVehicleInformation',
      },
    }
  },
  created() {
    this.resize = () => {
      this.maxHeight = this.$refs.inner.offsetHeight
    }
  },
  mounted() {
    //车型
    getRefCodesByType('车型_网络').then(res => {
      if (res.success === '1') {
        this.carType = res.data
      }
    })
    //车长
    getRefCodesByType('车长_网络').then(res => {
      if (res.success === '1') {
        this.carLong = res.data
      }
    })
    //车轴
    getRefCodesByType('车辆轴数').then(res => {
      if (res.success === '1') {
        this.carAxel = res.data
      }
    })
    //车辆颜色
    getRefCodesByType('车辆颜色').then(res => {
      if (res.success === '1') {
        this.carColor = res.data
      }
    })
    this.refreshList()
    //司机
    getDriverModelList({
      dvrName: '',
      PageIndexs: '',
      PageSizes: '',
    }).then(res => {
      if (res.success === '1') {
        this.driver = res.data
      }
    })
  },
  methods: {
    //调取父组件方法
    clickEventDom(item) {
      console.log(item.mdlCode, 333)
      if (item.mdlCode === 'add') {
        this.addCar()
      } else if (item.mdlCode === 'edit') {
        this.editCar()
      } else if (item.mdlCode === 'del') {
        this.delCar()
      } else if (item.mdlCode === 'downloadVehicleInformation') {
        this.down()
      } else if (item.mdlCode === 'handleImport') {
        this.handleImport()
      }
    },
    /** 导入按钮操作 */
    handleImport() {
      this.uploadParam.title = '车辆信息导入'
      this.uploadParam.open = true
      this.uploadParam.data.fltUuid = store.state.user.FLT_UUID_DX_H
      this.uploadParam.data.fltName = store.state.user.USERNAME_DX_H
    },
    // 文件上传中处理
    handleFileUploadProgress() {
      this.uploadParam.isUploading = true
    },
    // 文件上传成功处理
    handleFileSuccess(response) {
      this.uploadParam.open = false
      this.uploadParam.isUploading = false
      this.$refs.upload.clearFiles()
      if (response.success == '2002') {
        this.$alert(response.msg, '导入结果', { dangerouslyUseHTMLString: true })
      } else {
        this.$alert(response.data, '导入结果', { dangerouslyUseHTMLString: true })
      }
      this.getList()
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit()
    },
    //查询
    search() {
      this.$refs.form.validate(valid => {
        if (valid) {
          this.refreshList()
        }
      })
    },

    getList(currentPage, pageSize, updateTotal) {
      getVehicleModelList({
        trkNo: this.form.trkNo,
        trkType: this.form.trkType,
        PageIndexs: currentPage.toString(),
        PageSizes: pageSize.toString(),
      }).then(response => {
        this.tableData = response.data
        // this.tableData.map(item =>{
        //   return Object.assign(item,{typeList:'6666666666'})
        // })
        // this.tableData.forEach(item =>{
        //   this.$set(item,'typeList','99999')
        //   // item['typeList'] = '111111'
        // })
        // console.log(this.tableData)
        updateTotal(Number(response.total))
      })
    },
    // 上传图片
    uploadImage({ file }) {
      uploadVehicleImg(file, this.issuse, this.currentData.uuid).then(res => {
        if (res.success == '1') {
          this.refreshList()
          this.$alert('图片上传成功！', '提示', {
            confirmButtonText: '确定',
          }).then(() => {
            this.uploadClose()
          })
        }
      })
      this.openUpload = false
    },
    // 图片上传之前的检查
    beforeUpload(file) {
      if (this.issuse.length === 0) {
        this.$message.error({
          message: '请选择上传证件的正反面',
          showClose: true,
        })
        return false
      }
      if (file.type.indexOf('image') === -1) {
        this.$message.error({
          message: '请上传正确的图片类型',
          showClose: true,
        })
        return false
      }

      if (file.size / 1024 / 1024 > this.size) {
        this.$message.warning({
          message: '建议文件大小在5M以内',
          showClose: true,
        })
        return false
      }
    },
    //证件查看
    viewPic(row) {
      // window._$api.IMAGE_PREFIX
      this.trkDrivingPositive = window._$api.IMAGE_PREFIX + row.trkDrivingPositive
      this.trkDrivingReverse = window._$api.IMAGE_PREFIX + row.trkDrivingReverse
      this.openUpload = true
      this.title = '查看证件'
      this.pic = true
      this.widthImg = '600px'
    },
    //证件上传
    upload() {
      this.openUpload = true
      this.title = '上传证件'
      this.pic = false
    },
    //双击查看啊详情
    dbrowClick(row) {
      this.openDialog = true
      this.see = true
      this.edit = true
      this.dialogForm = Object.assign({}, row)
    },
    //单击行
    rowClick(row) {
      this.currentData = Object.assign({}, row)
    },
    //删除车辆
    delCar() {
      if (Object.keys(this.currentData).length === 0) {
        this.$alert('请选择需要删除的数据！', '提示', {
          confirmButtonText: '确定',
        })
        return
      }
      this.$confirm('您确定要删除该数据吗？', '提示', {
        confirmButtonText: '确定',
      }).then(() => {
        delVehicleModel({ uuid: this.currentData.uuid }).then(res => {
          if (res.success === '1') {
            this.$message({
              type: 'success',
              message: '删除成功',
              showClose: true,
            })
            this.close()
          }
        })
      })
    },

    // 审核
    audit() {
      //1.先判断是否已审核 2.执行审核
      if (Object.keys(this.currentData).length === 0) {
        this.$alert('请选择需要审核的数据！', '提示', {
          confirmButtonText: '确定',
        })
        return
      }
      if (this.currentData.status === '1') {
        this.$alert('请选择未审核的数据！', '提示', {
          confirmButtonText: '确定',
        })
        return
      }

      this.$confirm('您确定要审核该数据吗？', '提示', {
        confirmButtonText: '确定',
      }).then(() => {
        auditCarMethod({ uuid: this.currentData.uuid, status: 1 }).then(res => {
          if (res.success === '1') {
            this.$message({
              type: 'success',
              message: '审核成功',
              showClose: true,
            })
            this.close()
          }
        })
      })
    },

    // 取消审核
    cancelAudit() {
      if (Object.keys(this.currentData).length === 0) {
        this.$alert('请选择需要取消审核的数据！', '提示', {
          confirmButtonText: '确定',
        })
        return
      }

      if (this.currentData.status === '0') {
        this.$alert('请选择已审核的数据！', '提示', {
          confirmButtonText: '确定',
        })
        return
      }

      this.$confirm('您确认要取消审核此数据吗?', '提示', {
        confirmButtonText: '确定',
      }).then(() => {
        auditCarMethod({ uuid: this.currentData.uuid, status: 0 }).then(res => {
          if (res.success === '1') {
            this.$message({
              type: 'success',
              message: '取消审核成功',
              showClose: true,
            })
            this.close()
          }
        })
      })
    },

    startTimeChange() {
      let vbsStartime
      let vbsEndtime
      vbsStartime = new Date(Date.parse(this.dialogForm.trkRegisterdate))
      vbsEndtime = new Date(Date.parse(this.dialogForm.trkIssuedate))
      if (vbsStartime > vbsEndtime) {
        this.dialogForm.trkRegisterdate = ''
        this.$message.error({
          showClose: true,
          message: '注册日期不能大于发证日期！',
          type: 'warning',
          duration: 8000,
        })
      }
    },
    endTimeChange() {
      let vbsStartime
      let vbsEndtime
      vbsStartime = new Date(Date.parse(this.dialogForm.trkRegisterdate))
      vbsEndtime = new Date(Date.parse(this.dialogForm.trkIssuedate))
      if (vbsStartime > vbsEndtime) {
        this.dialogForm.trkIssuedate = ''
        this.$message.error({
          showClose: true,
          message: '发证日期不能小于注册日期！',
          type: 'warning',
          duration: 8000,
        })
      }
    },

    //保存
    save() {
      this.$refs.dialogForm.validate(valid => {
        if (valid) {
          if (this.edit) {
            //编辑
            editVehicleModel(this.dialogForm).then(res => {
              if (res.success === '1') {
                this.$message({
                  type: 'success',
                  message: '编辑数据成功！',
                  showClose: true,
                })
                this.close()
              }
            })
          } else {
            //新增
            addVehicleModel(this.dialogForm).then(res => {
              if (res.success === '1') {
                this.$message({
                  type: 'success',
                  message: '新增数据成功！',
                  showClose: true,
                })
                this.close()
              }
            })
          }
        }
      })
    },
    //编辑车辆
    editCar() {
      //1.先判断是否已审核 2.执行编辑
      if (Object.keys(this.currentData).length === 0) {
        this.$alert('请选择需要编辑的数据！', '提示', {
          confirmButtonText: '确定',
        })
        return
      }
      this.openDialog = true
      this.see = false
      this.edit = true
      this.name = '编辑车辆信息'
      this.dialogForm = Object.assign({}, this.currentData)
    },
    //模板下载
    down() {
      downloadVehicleInformation().then(res => {
        const fileName = decodeURI(res.headers['filename'])
        const reader = new FileReader()
        reader.readAsDataURL(new Blob([res.data]))
        reader.onload = e => {
          let a = document.createElement('a')
          a.download = fileName
          a.href = e.target.result
          document.body.appendChild(a)
          a.click()
          document.body.removeChild(a)
        }
        window.parent._$store.dispatch('app/loading_status', false)
      })
    },
    //导入 ---弃用
    // uploadExcel ({ file}) {
    //   this.fltUuid = store.state.user.FLT_UUID_DX_H
    //   this.fltName = store.state.user.USERNAME_DX_H
    //   if (file.name.substring(file.name.length-5,file.name.length) != '.xlsx'){
    //     this.$alert('导入文件格式有误！', '提示', {
    //       confirmButtonText: '确定'
    //     }).then(()=>{
    //       this.uploadClose()
    //     })
    //     return
    //   }
    //   importDynamicNode(file,this.fltUuid,this.fltName).then(res => {
    //     if(res.success=='1'){
    //       this.refreshList(),
    //       this.$alert(res.data, '提示', {
    //         confirmButtonText: '确定'}).then(()=>{this.uploadClose()})
    //     }
    //   })
    //   this.openUpload=false
    // },
    //新增车辆
    addCar() {
      this.openDialog = true
      this.see = false
      this.edit = false
      this.name = '新增车辆信息'
      this.dialogForm = {
        trkNo: '',
        trkDriverUuid: '',
        trkConductor: '',
        trkType: '',
        trkOwner: '',
        trkGrossmass: '',
        trkTonnage: '',
        trkColorcode: '',
        trkUsercharacter: '',
        trkVin: '',
        trkIssuingorg: '',
        trkRegisterdate: '',
        trkIssuedate: '',
        trkEnergytype: '',
        trkAxlenumber: '',
        trkRtcn: '',
        trkEnginenumber: '',
        trkTvpn: '',
        trkVlflag: 'Y',
        bz: '',
      }
    },
    //关闭上传对话框
    closeUpload() {
      this.openUpload = false
    },
    //关闭车辆对话框
    close() {
      this.openDialog = false
      this.currentData = {}
      this.refreshList()
    },
  },
  components: {
    buttonName,
  },
}
</script>
<style lang="scss" scoped>
.pic {
  height: 500px;
  overflow: auto;
  img {
    width: 100%;
  }
}
.driver {
  width: 100%;
  height: 100%;
  padding: 15px 15px 12px;
  display: flex;
  flex-direction: column;
  .form {
    height: 30px;
  }
  .btn {
    height: 50px;
    line-height: 50px;
    position: relative;
    .upload {
      position: absolute;
      top: 2px;
      left: 382px;
      ::v-deep .el-button--small,
      .el-button--small.is-round {
        background: #ecf5ff;
        border: 1px solid #b3d8ff;
        line-height: 10px;
        color: #409eff;
        ::v-deep .el-button--small,
        .el-button--small.is-round:hover {
          background: red;
        }
      }
    }
  }
  .name {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
  }
  .table {
    flex: 1;
  }
  .pages {
    height: 30px;
  }

  .box {
    //上传对话框
    overflow: hidden;
    height: 200px;
    .selectItem {
      // float:right;
      display: inline-block;
      width: 50%;
      height: 100%;
      box-sizing: border-box;
      padding: 20px;
    }
    .upload {
      // float:right;
      display: inline-block;
      width: 50%;
      height: 100%;
      box-sizing: border-box;
      padding: 20px;
    }
  }
}
</style>
